/* 
    Document   : grid60
    Created on : 23/12/2011, 23:25:17
    Author     : robert
    Description:
       Estilizacao do Grid.
       Baseado no sistema grid960 http://www.grid960.gs
*/


/* Centraliza o grid na pagina */
.container60{
    margin-left: auto;
    margin-right: auto;
}


/* Definicoes padrao dos grids */
.grid-1, .grid-2,
.grid-3, .grid-4,
.grid-5, .grid-6,
.grid-7, .grid-8,
.grid-9, .grid-10,
.grid-11, .grid-12, 
.grid-13, .grid-14
.grid-15, .grid-16,
.grid-17
{
    display: inline;
    float: left;
    margin-left: 10px;
    margin-right: 10px;
}

/* Grids que definem o tamanho das colunas */
.container60 .grid-1{ width: 60px;}
.container60 .grid-2{ width: 140px;}
.container60 .grid-3{ width: 220px;}
.container60 .grid-4{ width: 300px;}
.container60 .grid-5{ width: 380px;}
.container60 .grid-6{ width: 460px;}
.container60 .grid-7{ width: 540px;}
.container60 .grid-8{ width: 620px;}
.container60 .grid-9{ width: 700px;}
.container60 .grid-10{ width: 780px;}
.container60 .grid-11{ width: 860px;}
.container60 .grid-12{ width: 940px;}
.container60 .grid-13{ width: 1020px;}
.container60 .grid-14{ width: 1100px;}
.container60 .grid-15{ width: 1180px;}
.container60 .grid-16{ width: 1260px;}
.container60 .grid-17{ width: 1340px;}

/* Adiciona antes do objeto espaco de .prev-X colunas (grids) */
.container60 .prev-1{ padding-left: 80px;}
.container60 .prev-2{ padding-left: 160px;}
.container60 .prev-3{ padding-left: 240px;}
.container60 .prev-4{ padding-left: 320px;}
.container60 .prev-5{ padding-left: 400px;}
.container60 .prev-6{ padding-left: 480px;}
.container60 .prev-7{ padding-left: 560px;}
.container60 .prev-8{ padding-left: 640px;}
.container60 .prev-9{ padding-left: 720px;}
.container60 .prev-10{ padding-left: 800px;}
.container60 .prev-11{ padding-left: 880px;}
.container60 .prev-12{ padding-left: 960px;}
.container60 .prev-13{ padding-left: 1040px;}
.container60 .prev-14{ padding-left: 1120px;}
.container60 .prev-15{ padding-left: 1200px;}
.container60 .prev-16{ padding-left: 1280px;}

/* Adiciona apos do objeto espaco de .prev-X colunas (grids) */
.container60 .back-1{ padding-right: 80px;}
.container60 .back-2{ padding-right: 160px;}
.container60 .back-3{ padding-right: 240px;}
.container60 .back-4{ padding-right: 320px;}
.container60 .back-5{ padding-right: 400px;}
.container60 .back-6{ padding-right: 480px;}
.container60 .back-7{ padding-right: 560px;}
.container60 .back-8{ padding-right: 640px;}
.container60 .back-9{ padding-right: 720px;}
.container60 .back-10{ padding-right: 800px;}
.container60 .back-11{ padding-right: 880px;}
.container60 .back-12{ padding-right: 960px;}
.container60 .back-13{ padding-right: 1040px;}
.container60 .back-14{ padding-right: 1120px;}
.container60 .back-15{ padding-right: 1200px;}
.container60 .back-16{ padding-right: 1280px;}


/* Definicoes padrao para push e pull*/
.push-1, .pull-1,
.push-2, .pull-2,
.push-3, .pull-3,
.push-4, .pull-4,
.push-5, .pull-5,
.push-6, .pull-6,
.push-7, .pull-7,
.push-8, .pull-8,
.push-9, .pull-9,
.push-10, .pull-10,
.push-11, .pull-11,
.push-12, .pull-12,
.push-13, .pull-13,
.push-14, .pull-14,
.push-15, .pull-15,
.push-16, .pull-16{
  position: relative;
}

/* reposiciona (empurra) objetos em push-X */
.container60 .push-1{ left: 80px;}
.container60 .push-2{ left: 160px;}
.container60 .push-3{ left: 240px;}
.container60 .push-4{ left: 320px;}
.container60 .push-5{ left: 400px;}
.container60 .push-6{ left: 480px;}
.container60 .push-7{ left: 560px;}
.container60 .push-8{ left: 640px;}
.container60 .push-9{ left: 720px;}
.container60 .push-10{ left: 800px;}
.container60 .push-11{ left: 880px;}
.container60 .push-12{ left: 960px;}
.container60 .push-13{ left: 1040px;}
.container60 .push-14{ left: 1120px;}
.container60 .push-15{ left: 1200px;}
.container60 .push-16{ left: 1280px;}


/* reposiciona (puxa) objetos em pull-X */
.container60 .pull-1{ left: -80px;}
.container60 .pull-2{ left: -160px;}
.container60 .pull-3{ left: -240px;}
.container60 .pull-4{ left: -320px;}
.container60 .pull-5{ left: -400px;}
.container60 .pull-6{ left: -480px;}
.container60 .pull-7{ left: -560px;}
.container60 .pull-8{ left: -640px;}
.container60 .pull-9{ left: -720px;}
.container60 .pull-10{ left: -800px;}
.container60 .pull-11{ left: -880px;}
.container60 .pull-12{ left: -960px;}
.container60 .pull-13{ left: -1040px;}
.container60 .pull-14{ left: -1120px;}
.container60 .pull-15{ left: -1200px;}
.container60 .pull-16{ left: -1280px;}


/* Retira margem inicial e final do objeto */
.alpha {
  margin-left: 0;
}

.omega {
  margin-right: 0;
}

/* `Clear Floated Elements
----------------------------------------------------------------------------------------------------*/

/* http://sonspring.com/journal/clearing-floats */

.clear {
  clear: both;
  display: block;
  overflow: hidden;
  visibility: hidden;
  width: 0;
  height: 0;
}


/* http://www.yuiblog.com/blog/2010/09/27/clearfix-reloaded-overflowhidden-demystified */

.clearfix:before,
.clearfix:after,
.container60:before,
.container60:after {
  content: '.';
  display: block;
  overflow: hidden;
  visibility: hidden;
  font-size: 0;
  line-height: 0;
  width: 0;
  height: 0;
}

.clearfix:after,
.container60:after {
  clear: both;
}

/*
  The following zoom:1 rule is specifically for IE6 + IE7.
  Move to separate stylesheet if invalid CSS is a problem.
*/

.clearfix,
.container60 {
  zoom: 1;
}